<template>
  <div class="msg-box">
    <el-timeline v-if="returnList.length != 0">
      <el-timeline-item v-for="(item, index) of returnList" :key="index" :timestamp="item.checkReturn.returnTime" placement="top">
        <el-card shadow="hover" class="point" style="width: 90%;">
          <div @click="handleCheck(item, index)">
            <h4 class="font-highlight">{{ item.checkReturn.returnReason }}</h4>
            <p v-html="item.checkList.checkInfo"></p>
            <p style="margin-top: 20px;">{{ item.checkReturn.returnInfo }}</p>
          </div>
        </el-card>
      </el-timeline-item>
    </el-timeline>
    <div v-else>
      <mallki class-name="mallki-text" text="暂无消息" />
      <div class="nomsg-cl">
        <!-- <img src="../../../../assets/img/nomsg.gif" class="nomsg-cl" /> -->
      </div>
    </div>

    <get
      v-if="getVisible"
      @close="close('getVisible')"
      @refreshData="getInfo"
      :childDataForm="childDataForm"
      :returnInfo="returnInfo" />
  </div>
</template>

<script>
  import { isBlank } from '@/common/js/utils'
  import { CODE_OK } from '@/common/js/config'
  import { getMsgInfo,getListByCheckId,cancelCheck,iknow } from '@/api/check'
  import Get from '@/views/modules/process/get/get'
  import Mallki from '@/components/TextHoverEffect/Mallki'
  export default{
    components: {
    	Get,
      Mallki
    },
    data() {
      return {
        getVisible: false,
        childDataForm: '',
        returnInfo: '',
        returnList: []
      }
    },
    created() {
      this.getInfo()
    },
    methods: {
      handleCheck(item, index) {
        let checkList = item.checkList
        let checkReturn = item.checkReturn
        if (checkReturn.fromStatus != 99) {
          if (checkList.checkTypeId == 6) {
            this.$confirm('稳定性考察请验单错误只允许在修改计划后重新发起，确定作废此单？', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              const data = {
                checkId: checkList.checkId,
                content: 'wk'
              }
              cancelCheck(data).then(res => {
                if (res.code === CODE_OK) {
                  this.getInfo()
                  this.$message({
                    message: '作废成功，请修改计划后重新发起',
                    type: 'success',
                    duration: 1500
                  })
                }else{
                  this.$message.error(res.msg)
                }
              })
            })
          }else{
            if (this.statusMap(checkReturn.toStatus) == '请验') {
              this.$router.push({
              	path: this.getPrintCheckUrl(checkList.checkTypeId, checkList.printCheckVersion),
                query: {
                  checkId: checkList.checkId,
                  fromUserName: checkReturn.fromUserName,
                  fromStatus: checkReturn.fromStatus,
                  checkReturnId: checkReturn.checkReturnId
                }
              })
            }else if(this.statusMap(checkReturn.toStatus) == '取样') {
              const params = {
                checkId: checkList.checkId
              }
              getListByCheckId(params).then(res => {
                if (res.code === CODE_OK) {
                  let arr = []
                  arr.push(res.list)
                  this.childDataForm = arr
                  this.returnInfo = checkReturn
                  this.getVisible = true
                }else{
                  this.$message.error(res.msg)
                }
              })
            }
          }
        }else{
          this.$confirm('我知道了', '', {
            confirmButtonText: '确定收到',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            iknow(checkReturn.checkReturnId).then(res => {
              if (res.code === CODE_OK) {
                this.returnList.splice(index, 1)
              }else{
                this.$message.error(res.msg)
              }
            })
          }).catch(() => {})
        }
      },
      getInfo() {
        this.returnList = []
        getMsgInfo().then(res => {
          if (res.code === CODE_OK) {
            if (!isBlank(res.list)) {
              this.returnList = res.list.map(vo => {
                let cl = vo.checkList
                let cr = vo.checkReturn
                let checkInfo = '【' + cl.checkTypeName + '】' + cl.productName +
                    '(编号:'+cl.checkId+',批号:' + cl.batchNum + ',规格:' + cl.productSpec + ')'
                let returnInfo
                if (cr.fromStatus != 99) {
                  returnInfo = cr.fromUserName + '在 ' + this.statusMap(cr.fromStatus) + ' 时退回了您的请验单  ' + cr.returnTime
                }else{
                  returnInfo = ''
                }
                this.$set(vo.checkList, 'checkInfo', checkInfo)
                this.$set(vo.checkReturn, 'returnInfo', returnInfo)
                return vo
              })
              this.$alert('有退回消息(通知消息)，请点击红色字体来处理，若无法处理，请作废此单后重新发起', '注意', {
                confirmButtonText: '确定',
                callback: action => {}
              })
            }
          }else{
            this.$message.error(res.msg)
          }
        })
      },
      close(val) {
        this.childDataForm = ''
        this[val] = !this[val]
        location.reload()
      },
      statusMap(status) {
        const map = {
          0: '请验',
          1: '取样',
          2: '收样',
          3: '分样',
          4: '检验',
          5: '检验',
          6: '结论',
          7: '放行'
        }
        return map[status]
      }
    }
  }
</script>

<style scoped>
  .mallki-text {
    left: 25px;
    font-size: 20px;
    font-weight: bold;
  }
  >>> .el-card__body{
    padding: 0 20px;
  }
  .nomsg-cl{
    height: 515px;
    width: 100%;
    background-color: #FFF;
  }
  .msg-box{
    width: 100%;
    padding-top: 20px;
    background-color: #FFF;
  }
</style>
